<div class="b-island__title">
    {{'testcase.TESTCASE' | translate}}<span ng-show="testcase.name" class="text-muted">: {{testcase.name}} <copy-button text="testcase.name"></copy-button></span>
</div>
<div class="pane__header title-status-{{testcase.status | lowercase}}">
    <h3>
        <div class="pane__header_controls pull-right">
            <span class="fa fa-expand clickable" tooltip="{{'tooltip.EXPAND' | translate}}" ng-hide="isState('testcase.expanded')" ng-click="go('testcase.expanded')"></span>
            <span class="fa fa-compress clickable" tooltip="{{'tooltip.COLLAPSE' | translate}}" ng-show="isState('testcase.expanded')" ng-click="go('testcase')"></span>
            <span class="fa fa-close clickable" tooltip="{{'tooltip.CLOSE' | translate}}" ng-click="closeTestcase()"></span>
        </div>
        <span class="icon-status-{{testcase.status | lowercase}}"></span>
        {{testcase.title}}
        <small translate="testcase.SEVERITY" translate-value-severity="{{testcase.severity | translate}}"></small>
    </h3>
    <div class="external-system-references">
        <span ng-show="testcaseArguments.length > 0">
            <span class="fa fa-sliders"/>
            <span>{{'testcase.PARAMETERS' | translate}}: [</span>
            <span ng-repeat="argument in testcaseArguments">
                <span class="line-nobreak">
                    <span>{{argument.name}} = "
                        <span title = {{argument.value}} class="line-ellipsis parameter-value">{{argument.value}} </span>
                        "
                    </span>
                    <span ng-show="!$last">;</span>
                </span>
            </span>
            <span>]</span>
        </span>
        <span class="issues" ng-show="testcase.issues">
            <span class="fa fa-bug"/>
            {{'testcase.ISSUES' | translate}}
            <span class="issue" ng-repeat="issue in testcase.issues">
                <a ng-href="{{issue.url}}" target="_blank">{{issue.name}}</a><span ng-show="!$last">,</span>
            </span>
        </span>
        <span class="testId" ng-show="testcase.testId">
            <span class="fa fa-database"/>
            {{'testcase.TEST_ID' | translate}}
            <a ng-href="{{testcase.testId.url}}" target="_blank">{{testcase.testId.name}}</a>
        </span>
    </div>
</div>
<div class="testcase__content" on-keynav="select($direction)">
    <div class="testcase__description" text-cut="testcase.description.value" ng-show="testcase.description.value"
            escape-html="{{testcase.description.type.toLowerCase() != 'markdown'}}"></div>
    <div ng-include="'testcaseFailure.tpl'"></div>
    <div class="environments">
        <div class="environment" ng-repeat="property in testcase.parameters | filter:{'kind':'ENVIRONMENT_VARIABLE'}">
            <div class="pull-left environment_name text-muted">{{property.name}}:</div>
            <div class="pull-left" ng-bind-html="property.value | linky"></div>
        </div>
    </div>
    <div class="step" ng-repeat="step in testcase.steps" ng-controller="StepCtrl">
        <ng-include src="'testcaseStep.tpl'"></ng-include>
    </div>
    <div class="testcase__status alert-status-passed" ng-show="testcase.status == 'PASSED'">
        {{'testcase.TEST_PASSED' | translate}}
    </div>
    <div class="list-item clickable" ng-repeat="attachment in testcase.attachments" ng-click="setAttachment(attachment.uid)" ng-class="{active:attachment==$parent.attachment}">
        <ng-include src="'testcaseAttachment.tpl'"></ng-include>
    </div>
</div>
<br/>
<script type="text/ng-template" id="testcaseFailure.tpl">
    <div class="testcase__status alert-status-{{testcase.status | lowercase}}" ng-show="testcase.status !== 'PASSED'" ng-controller="angular.noop">
        <div class="btn-group pull-right ">
            <span class="btn btn-default btn-sm btn-status-{{testcase.status|lowercase}}" ng-click="stacktraceRaw = !stacktraceRaw" ng-class="{'active': stacktraceRaw}">{{'testcase.RAW' | translate}}</span>
            <span class="btn btn-default btn-sm btn-status-{{testcase.status|lowercase}}" ng-click="stacktraceExpanded = !stacktraceExpanded" ng-class="{'active': stacktraceExpanded}">{{'testcase.STACKTRACE' | translate}}</span>
        </div>

        <span class="preformated-text" ng-class="{'testcase__status--raw': stacktraceRaw}">{{failure.message}}</span>
        <div ng-show="stacktraceExpanded" class="testcase__stacktrace preformated-text" ng-class="{'testcase__status--raw': stacktraceRaw}">{{failure.stackTrace}}</div>
    </div>
</script>
<script type="text/ng-template" id="testcaseAttachment.tpl">
    <span ng-class="getIconClass(attachment.type)" tooltip="{{attachment.type}}"></span>
    <span>{{attachment.title}}</span>
    <a target="_blank" ng-click="$event.stopPropagation()" ng-href="{{'data/'+attachment.source}}" class="pull-right attachment_size">
        <i class="fa fa-floppy-o"></i>
        <i>{{attachment.size | filesize}}</i>
    </a>
</script>
<script type="text/ng-template" id="testcaseStep.tpl">
    <div class="list-item" ng-click="toggleExpand()" ng-class="{clickable: hasContent}">
        <b class="step__expand" ng-show="hasContent && !expanded">+</b>
        <b class="step__expand" ng-show="hasContent && expanded">-</b>
        <span class="step__time text-muted">[{{step.time.start | date:'HH:mm:ss.sss'}}]</span>
        <span class="step__title" ng-class="getStepClass(step)">{{step.title}}</span>
        <span class="step__time text-muted">({{step.time.duration | time}})</span>
        <span class="text-muted" ng-hide="step.summary.steps==0">{{'testcase.SUBSTEPS' | translate:"{substeps: step.summary.steps}":"messageformat"}}</span>
        <span class="text-muted" ng-hide="step.summary.steps==0 || step.summary.attachments==0">, </span>
        <span class="text-muted" ng-hide="step.summary.attachments==0">{{'testcase.ATTACHMENTS' | translate:"{attachments: step.summary.attachments}":"messageformat"}}</span>
        <span class="pull-right icon-status-{{step.status | lowercase}}" ng-show="isFailed(step)"></span>
    </div>
    <div class="step__content" ng-if="expanded">
        <div ng-repeat="step in step.steps" ng-controller="StepCtrl">
            <ng-include src="'testcaseStep.tpl'"></ng-include>
        </div>
        <div ng-include="'testcaseFailure.tpl'" ng-if="step.failure"></div>
        <div class="list-item clickable" ng-repeat="attachment in step.attachments" ng-click="setAttachment(attachment.uid)" ng-class="{active:attachment==$parent.attachment}">
            <ng-include src="'testcaseAttachment.tpl'"></ng-include>
        </div>
    </div>
</script>
